<template>
	<view>
		<van-tabs active="a">
			<van-tab title="全部订单" name="a">
				<view class="container">
					<view class="view">
						<image src="https://s1.ax1x.com/2020/10/12/0Wuzgf.png" mode=""></image>
						<view class="shopname">{{shopname}}</view>
						<view class="view_text">已完成</view>
					</view>
					<view class="list" v-for="(item,index) in list">
						<view class="">{{item.name}}</view>
						<view class="">x{{item.count}}</view>
					</view>
					<view class="price">实付￥{{price}}</view>
				</view>
			</van-tab>
			<van-tab title="待评价" name="b">
				<view class="container">
					<view class="view">
						<image src="https://s1.ax1x.com/2020/10/12/0Wuzgf.png" mode=""></image>
						<view class="shopname">{{shopname}}</view>
						<view class="view_text">已完成</view>
					</view>
					<view class="list" v-for="(item,index) in list">
						<view class="">{{item.name}}</view>
						<view class="">x{{item.count}}</view>
					</view>
					<view class="price">实付￥{{price}}</view>
				</view>
			</van-tab>
			<van-tab title="退款" name="c">
				<view class="container">
					<view class="view">
						<image src="https://s1.ax1x.com/2020/10/12/0Wuzgf.png" mode=""></image>
						<view class="shopname">{{shopname}}</view>
						<view class="view_text">已完成</view>
					</view>
					<view class="list" v-for="(item,index) in list">
						<view class="">{{item.name}}</view>
						<view class="">x{{item.count}}</view>
					</view>
					<view class="price">实付￥{{price}}</view>
				</view>
			</van-tab>
		</van-tabs>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [],
				shopname: [],
				price: []
			}
		},
		methods: {

		},
		onLoad() {

		},
		onShow() {
			var that = this;
			that.list = uni.getStorageSync("list");
			that.shopname = uni.getStorageSync("shopname");
			that.price = uni.getStorageSync("price");
		}
	}
</script>

<style scoped>
	.view {
		display: flex;
		justify-content: start;
	}

	.view image {
		width: 60px;
		height: 60px;
	}

	.container {
		width: 95%;
		margin-left: 2.5%;
		margin-top: 20px;
	}

	.shopname {
		font-size: 16px;
		font-weight: 900;
		margin-left: 2%;
		width: 68%;
		padding-top: 15px;
		border-bottom: 1px solid #BABABA;
	}

	.view_text {
		color: #808080;
		padding-top: 15px;
		border-bottom: 1px solid #BABABA;
	}

	.list {
		display: flex;
		justify-content: space-between;
		width: 80%;
		margin-left: 19%;
		font-size: 15px;
		color: #808080;
		margin-top: 3px;
	}

	.price {
		width: 80%;
		margin-left: 19%;
		font-size: 15px;
		text-align: right;
		margin-top: 5px;
	}
</style>
